<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="../styles/reset.css">
  <link rel="stylesheet" href="../styles/font.css">
  <link rel="stylesheet" href="../styles/base.css">
  <link rel="stylesheet" href="../styles/css/apply.css">
  <title>瑜伽星人</title>
</head>
<body>
  <div class="container">
    <div class="content">
      <form class="from-wrap">
        <h2 class="pic-title">生活照（<span>0\4</span>）</h2>
        <div class="add-area">
          <div class="add-btn">
            <div class="add-block"></div>
            <div class="add-block rotate-block"></div>
          </div>
        </div>
        <h2 class="pic-title">场馆照片（<span>0\4</span>）</h2>
        <div class="add-area">
          <div class="add-btn">
            <div class="add-block"></div>
            <div class="add-block rotate-block"></div>
          </div>
        </div>
        <!-- 提交按钮2种状态 -->
        <button class="clear-btn common-btn large-btn" onclick="window.location='./applySuccess.html';">提交</button>
        <button class="clear-btn common-btn large-btn light-pink js-hidden">已报名</button>
      </form>
    </div>
    <!-- 报名成功弹框 -->
    <div class="pop-wrap js-hidden">
      <div class="pop-content">
        <img class="success-img" src="http://cdn.50yoga.cn/pics/public/sweet/images/shopkeeper/success.png" width="80" height="80">
        <p class="pop-title">报名成功</p>
        <div>
          <span class="pop-title">编号：</span><span class="pop-num">1234号</span>
        </div>
        <button class="clear-btn common-btn vote-btn">确定</button>
      </div>
    </div>
    <!-- 底部Tabbar -->
    <div class="tabbar-wrap" id="tabbar">
      <a class="tab-item" href="./index.html">
        <div class="bottom-wrap">
          <i class="iconfont icon-home"></i>
          <p class="tab-txt">首页</p>
        </div>
      </a>
      <a class="tab-item" href="./rank.html">
        <div class="bottom-wrap">
          <i class="iconfont icon-linerank"></i>
          <p class="tab-txt">排名</p>
        </div>
      </a>
      <a class="tab-item" href="./entrance.html">
        <div class="bottom-wrap">
          <i class="iconfont icon-edit"></i>
          <p class="tab-txt">报名</p>
        </div>
      </a>
      <a class="tab-item" href="./rule.html">
        <div class="bottom-wrap">
          <i class="iconfont icon-rule"></i>
          <p class="tab-txt">规则</p>
        </div> 
      </a>
    </div>
  </div>
</body>
<script>
  window.onload = function(){
    var tabs = document.getElementById('tabbar').getElementsByTagName('a')
    console.log(tabs.length);
  }
</script>
</html>